Toolboxes

Creating Your Own Toolbox Items Using Built-In Classes

You can create your own toolbox items to allow users to create instances of a custom shape or node type that you’ve defined. Toolbox items must be instances of DiagramNodeTool or DiagramConnectionTool.

For a node tool, you will need to set three properties on the DiagramNodeTool:

Builder: An IDiagramNodeBuilder which creates a node of the appropriate type and adds it to the diagram. You can create the builder instance as a resource or use the BuilderType markup extension.
CursorVisual: A Visual to be displayed when the toolbox item is being dragged onto the diagram surface, or when the user has selected the tool and is hovering over the diagram surface (the “charged cursor” mode).
Content: The UIElement or text to be displayed in the toolbox itself.

For a connection tool, you will need to set two properties on the DiagramConnectionTool:

Builder: An IDiagramConnectionBuilder which creates a node of the appropriate type and adds it to the diagram. You can create the builder instance as a resource or use the BuilderType markup extension.
Content: The UIElement or text to be displayed in the toolbox itself.

CopyCustom toolbox items

<local:CarConnectionBuilder x:Key="TowingConnector" CarConnectionKind="Towing" />

<ms:DiagramNodeTool Builder="{ms:BuilderType local:CarNodeBuilder}">
  <ms:DiagramNodeTool.CursorVisual>
    <TextBlock Text="Car" />
  </ms:DiagramNodeTool.CursorVisual>
  <TextBlock Text="Car" />
</ms:DiagramNodeTool>

<ms:DiagramConnectionTool Builder="{StaticResource TowingConnector}">
  <Path Style="{StaticResource ConnectionPathStyle}" Data="M 0 0 L 1 1" />
</ms:DiagramConnectionTool>

It is also common to provide a tooltip by setting the ToolTip property.

Toolbox items created in this way have the same behaviour as the standard toolbox items: in particular, they can be used in the same ways (drag, charged cursor, dragging of charged cursor) described above.

For a worked example, see the CustomNodeType sample.

Creating Your Own User Interface

You can of course create a completely custom user interface and have it call the diagramming API to create new nodes:

CopyC#

IDiagramModel diagram = GetDiagram();  // e.g. diagramSurface.Diagram
StartNode node = CreateStartNode(someText, someBounds);
diagram.Nodes.Add(node);